/**
 * tabs交互，实现增、删、左右移动
 *
 * @author  wysunminmin
 * @date 2014-04-29
 *
 */ 
var tab = null;
$.fn.extend({
	tab : function() { 
		var obj = { 
			$this : $(this) 
		}; 
		tab = new Tabs(obj); //方便记忆，jquery扩展名和实例化对象名都叫tab，其实是两个不同的东东
		return this;
	} 
}); 

function Tabs (obj){
	this.conter = obj.$this;
	this.num = 0; //当前打开的标签号
	this.index = 0; //打开标签的流水号  
	this.sign = false;
	this.tabSeriSign = true;
	this.canMoveSeri = true; 
	this.dot = this.conter.find("li");
	this.block = this.conter.find(".ui-div-panes");
	this.liWidth = 150;
	this.getGoLeft;
	this.init();
	
}
Tabs.prototype = { 
	init : function(){
		var me = this;
		me.switchTab(me.dot,me.block);  
	},
	tabSeri : function(){ 
		var me = this;
		me.tabSeriSign = false;
		me.conter.append('<div class="ui-tab-lr"><span class="tab-r"> > </span><span class="tab-l"> < </span><ul class="ui-setting-tabs clear"></ul></div><div class="ui-setting-panes"></div>');
	},
	addTab : function(){  
		var me = this;   
		if(me.tabSeriSign){ //dom结构初始化
			me.tabSeri();
		}
		var arr = []; 
		var li = me.conter.find("ul").find("li"); //获取li集合
		if(li.length <= 0){ //还没有li的情况新增
			me.conter.find("ul").append('<li tab="'+me.index+'">tab'+me.index+'</li>');
			me.conter.find("div.ui-setting-panes").append('<div tab="'+me.index+'" class="ui-div-panes" style="display:none">tabbbbbbbbbbbb'+me.index+'</div>'); 
			me.showCurTab(me.index);
		}else{ //已经存在li的情况新增
			for(var i=0; i<li.length; i++){
				arr.push(li.eq(i).attr("tab"));
			}
			me.index = Math.max.apply(Math,arr)+1;  //获取li中最大的tab值，+1后作为新插入的tab的值
			me.conter.find("ul").find("li.on").after('<li tab="'+me.index+'">tab'+me.index+'</li>');
			me.conter.find("div.ui-setting-panes").find("div.current-panes").after('<div tab="'+me.index+'" class="ui-div-panes" style="display:none">tabbbbbbbbbbbb'+me.index+'</div>'); 
			me.showCurTab(me.index); 
		}
		me.getGoLeft = parseInt(me.conter.find("ul").css("margin-left")); //获取ul的margin-left值 
	},
	moveLeftRight : function(index){  
		var me = this; 
		me.canMoveSeri = false; //允许左右移动标记，防止移动方法被多次调用，一旦移动方法被调用后就置为false 
		me.conter.find(".tab-l").live({ 
			click: function() {   //左移动事件
				if(me.sign){ //左右移动的条件，当内部长度大于外框长度的时候为true  
					me.getGoLeft = parseInt(me.conter.find("ul").css("margin-left")); //获取最新margin-left值 
					if(me.getGoLeft < 0 && -me.getGoLeft > me.liWidth){   //当左隐藏的至少有一个li的时候 
						me.conter.find("ul").css("margin-left",(me.getGoLeft+me.liWidth)+"px");  
					}else{  
						me.conter.find("ul").css({"margin-left":"10px","_margin-left":"5px"}); 
					}
				} 
			},
			mouseover: function() { 
					$(this).css({"color":"#000","background":"#ddd"});
			},
			mouseout: function() {
				$(this).css({"color":"#999","background":"#eee"});
			}
		});
		me.conter.find(".tab-r").live({
			click: function() {  //右移动事件 
				if(me.sign){  //左右移动的条件，当内部长度大于外框长度的时候为true   
					var conterWidth = me.conter.width()-10; //容器长度 
					var firstli = me.conter.find("ul").find("li:first"); //第一个li
					var lastli = me.conter.find("ul").find("li:last"); //最后一个li
					var lastliOfLeft = lastli.offset().left; //最后一个li相对于屏幕的左偏移量
					var conterOfLeft = me.conter.offset().left; //容器相对于屏幕的左偏移量  
					me.getGoLeft = parseInt(me.conter.find("ul").css("margin-left")); //获取最新margin-left值 
					if(lastliOfLeft > (conterWidth+conterOfLeft)){  //当右隐藏的至少有一个li的时候 
						me.conter.find("ul").css("margin-left",(me.getGoLeft-me.liWidth)+"px");
					}else if((lastliOfLeft+me.liWidth) > (conterWidth+conterOfLeft)){
						me.conter.find("ul").css("margin-left",(me.getGoLeft-(lastliOfLeft+me.liWidth-conterWidth-conterOfLeft))+"px");
					}else{
					}
				}
			},
			mouseover: function() { 
					$(this).css({"color":"#000","background":"#ddd"});
			},
			mouseout: function() {
				$(this).css({"color":"#999","background":"#eee"});
			}
		});  
		
	},
	showCurTab : function(index){  //当前显示的tab值 
		var me = this;
		var currli = me.conter.find("li[tab='"+index+"']"); //当前tab的li
		var currdiv = me.conter.find("div.ui-div-panes[tab='"+index+"']"); //当前tab的div
		currli.addClass("on").siblings().removeClass("on"); //显示当前li
		currdiv.css("display","block").addClass("current-panes").siblings(".ui-div-panes").css("display","none").removeClass("current-panes"); //显示当前div
		if(currli.prev().length != 0){  //如果是第一个的li，则对样式做个特殊处理，防止切换时抖动
			me.dot.first().css({"width":"149px","text-indent":"-1px"});
		}else{ 
			me.dot.first().css({"width":"148px","text-indent":"0px"});
		}      
		var conterWidth = me.conter.width()-10;  //容器长度-10 
		var currliPrevAllLen = currli.prevAll().length; //当前li的之前的所有li的个数
		var allLeftLiWidth = currliPrevAllLen*me.liWidth; //当前li之前的所有的li总长度
		var goLeft =conterWidth - allLeftLiWidth - me.liWidth;  //当左边的li不完全显示时，打开时需要左移动值，以求完整显示出 
		var currliOfLeft = currli.offset().left; //当前li相对于屏幕的左偏移量
		var conterOfLeft = me.conter.offset().left; //容器相对于屏幕的左偏移量
		me.getGoLeft = parseInt(me.conter.find("ul").css("margin-left")); //获取ul的margin-left值 
		if((allLeftLiWidth + me.liWidth) > conterWidth && (currliOfLeft - conterOfLeft) > (conterWidth - me.liWidth)){ 
		//当当前li之前的所有的li总长度+当前li的长度 > 容器长度 && 当前li是在靠左的位置
			currli.parent().css("margin-left",goLeft+"px"); //左处理
		}else{
			if(-me.getGoLeft > allLeftLiWidth){  //ul的margin-left值 > 当前li之前的所有的li总长度
				currli.parent().css("margin-left",-allLeftLiWidth+10+"px"); //右处理
			}
		} 
		if(me.conter.find("li").length*me.liWidth > conterWidth){ //当内部内容超出容器宽度时
			me.sign = true; 
			if(me.canMoveSeri){
				me.moveLeftRight(index);  
			} 
		}else{
			me.sign = false;
			me.getGoLeft = parseInt(currli.parent().css("margin-left")); //获取ul的margin-left值
		}
	},
	switchTab : function (dot,block) {  
		var me = this;
		$(block).css("display","none"); 
		$(dot).first().addClass("on").css("border-left","none");
		$(block).first().css({"display":"block"}).addClass("current-panes");  
		me.conter.delegate("li", "click", function(){ 
			num = $(this).attr("tab");   
			me.showCurTab(num); 
		});    
		$(dot).live({
		  mouseover: function() {
			if($(this).find(".close").length==0){
				$(this).append('<span class="close">×</span>');
			}else{
				$(this).find(".close").show();
			}
		  },
		  mouseout: function() {
			$(this).find(".close").hide();
		  }
		});     
		me.conter.delegate(".close", "click", function(event){
			num = $(this).parent().attr("tab");    
			var nextLen = $(this).parent().next().length; 
			var prevLen = $(this).parent().prev().length;  
			var pnum;
			if(nextLen != 0){
				pnum = $(this).parent().next().attr("tab"); 
				if($(this).parent().hasClass("on")){ 
					me.showCurTab(pnum); 
				}
				$(me.block+"[tab='"+num+"']").remove(); 
				$(this).parent().remove();   
			}else if(prevLen != 0){
				pnum = $(this).parent().prev().attr("tab"); 
				if($(this).parent().hasClass("on")){
					me.showCurTab(pnum); 
				}
				$(me.block+"[tab='"+num+"']").remove(); 
				$(this).parent().remove();  
			}else{
				me.showCurTab(num); 
			}
			var conterWidth = me.conter.width()-10; //容器长度 
			var firstli = me.conter.find("ul").find("li:first"); //第一个li
			var lastli = me.conter.find("ul").find("li:last"); //最后一个li
			var lastliOfLeft = lastli.offset().left; //最后一个li相对于屏幕的左偏移量
			var conterOfLeft = me.conter.offset().left; //容器相对于屏幕的左偏移量  
			me.getGoLeft = parseInt(me.conter.find("ul").css("margin-left")); //获取最新margin-left值 
			if(me.getGoLeft < 0 && -me.getGoLeft > me.liWidth){   //当左隐藏的至少有一个li的时候  
				if(lastliOfLeft > (conterWidth+conterOfLeft)){  //当右隐藏的至少有一个li的时候  
				}else if((lastliOfLeft+me.liWidth) > (conterWidth+conterOfLeft)){ 
				}else{
					me.conter.find("ul").css("margin-left",(me.getGoLeft-(lastliOfLeft+me.liWidth-conterWidth-conterOfLeft))+"px");
				}
			}else{  
				if(lastliOfLeft > (conterWidth+conterOfLeft)){  //当右隐藏的至少有一个li的时候  
				}else if((lastliOfLeft+me.liWidth) > (conterWidth+conterOfLeft)){ 
				}else{
					me.conter.find("ul").css({"margin-left":"10px","_margin-left":"5px"});
				}
				
			} 
			event.stopPropagation(); //阻止事件冒泡
		}); 
	}
}
